<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/custom.css"/>
	<style>
        .login-third {
            margin-top: 3rem;
        }
	</style>
</head>
<body style="background:url('../image/background.jpg');background-size:cover">
    <!-- <header class="aui-bar aui-bar-nav " id="aui-header" style="background-color:#24a2de">
        <div class="aui-title">登录</div>
    </header> -->
    <section class="aui-text-center aui-margin-b-15 aui-margin-t-15">
      <img class="perW50" style="margin:0 auto;" src="../image/badges.png">
    </section>
    <section class="aui-content-padded aui-margin-t-15">
        <form>
          <ul class="aui-list aui-form-list">
              <li class="aui-list-item">
                  <div class="aui-list-item-inner">
                      <div class="aui-list-item-label aui-border-r color-orange">
                          账号
                          <!-- <small class="aui-margin-l-5 aui-text-warning">+86</small> -->
                      </div>
                      <div class="aui-list-item-input aui-padded-l-10">
                          <input name="account" type="text" placeholder="输入账号" id="account"value="liqi" >
                      </div>
                  </div>
              </li>
              <li class="aui-list-item">
                  <div class="aui-list-item-inner">
                      <div class="aui-list-item-label aui-border-r color-orange">
                        密码
                        <!-- <i class="aui-margin-l-5 aui-iconfont aui-icon-display" onclick="showPsw(this);"></i> -->
                      </div>
                      <div class="aui-list-item-input aui-padded-l-10">
                          <input name="pwd" type="password" pattern="^[0-9a-zA-z_]{6,18}$" placeholder="输入密码" id="pwd" value="123456">
                      </div>
                  </div>
              </li>
          </ul>
        </form>
    </section>
    <!-- <section class="aui-content-padded">
        <input type="checkBox">记住密码
    </section> -->
    <section class="aui-content-padded">
        <div class="aui-btn aui-btn-block aui-btn-info aui-btn-sm" style="background-color:#03a9f4!important;height:45px;line-height:48px;" onclick="login();">登录</div>
    </section>
    <!-- <section class="aui-text-white aui-text-center">
        <div class="fixed bottom"><span>版本号:&copy;</span><span>1.0</span></div>
    </section> -->
    <!-- <section class="aui-content-padded login-third">
        <p class="aui-font-size-12 aui-text-center aui-margin-b-15">第三方账号登录</p>
        <div class="aui-grid" style="background: none;">
            <div class="aui-row">
                <div class="aui-col-xs-4">
                    <i class="aui-iconfont aui-icon-qq"></i>
                </div>
                <div class="aui-col-xs-4">
                    <i class="aui-iconfont aui-icon-wechat"></i>
                </div>
                <div class="aui-col-xs-4">
                    <i class="aui-iconfont aui-icon-weibo"></i>
                </div>
            </div>
        </div>
    </section> -->
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/properties.js"></script>
<script type="text/javascript" src="../script/login.js"></script>
<script type="text/javascript">
    apiready = function(){
        $api.fixStatusBar($api.dom('header'));
    };
    function showPsw(i){
      var psw = $api.byId('psw');
      if(psw.type=="text"){
        psw.type="password";
        $api.removeCls(i, 'aui-text-orange');
      }else if(psw.type=="password"){
        psw.type="text";
        $api.addCls(i,'aui-text-orange');
      }
    }
</script>
</html>
